<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>treeview</title>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <link rel="shortcut icon" href="favicon.ico">
    <link type="text/css" rel="stylesheet" href="css/tree.css">
</head>
<body>
    <div style="margin-bottom:5px;">
        <button id="init">init</button>
        <button id="showchecked">Get Seleceted Nodes</button>
        <button id="showcurrent">Get Current Node</button>
        <button id="btn-selectAll">select all</button>
        <button id="btn-selectNone">select none</button>
    </div>
    <div id="tree"></div>
    <script type="text/javascript" src="jquery-1.7.2.js"></script>
    <script type="text/javascript" src="tree.js"></script>
    <script type="text/javascript" src="all_categories.js"></script>
    <script type="text/javascript">
        var timeStart = $.now();
        var element = $("#tree");
        
        $('#init').click(function() {
            timeStart = $.now();
            element.tree({
                css: {
                    width: 500,
                    height: 200,
                    border: '1px solid #ddd',
                },
                checked: 0,renderAll: 0,
                //theme: 'x-tree-lines',
                onNodeClick: function(item) {
                    console.log(item)
                },
                data: ALL_CATEGORIES
            });
             console.log($.now() - timeStart);
        });
        
        console.log($.now() - timeStart);
        
        
        
        $('#showchecked').click(function(e) {
            timeStart = $.now();
            console.log(element.getTreeCheckedValues(false), $.now() - timeStart);
        });
        $('#showcurrent').click(function(e) {
            timeStart = $.now();
            console.log(element.getTreeCurrentNode(), $.now() - timeStart);
        });
        $('#btn-selectAll').click(function() {
            timeStart = $.now();
            element.setTreeCheckedNodes(false, 1);
            console.log($.now() - timeStart);
        });
        $('#btn-selectNone').click(function() {
            timeStart = $.now();
            element.setTreeCheckedNodes(false, 0);
            console.log($.now() - timeStart);
        });
    </script>
</body>
</html>
